<template>
	<template v-if="isCollect">
		<up-icon name="heart-fill" color="red" style="font-weight: 900" size="22"></up-icon>
	</template>
	<template v-else>
		<up-icon name="heart" color="#fff" style="font-weight: 900" size="22"
			@tap="collect(props.record)"></up-icon>
	</template>
	
</template>

<script setup>
	import { onMounted, ref, watch } from 'vue';
    import comicApi from '@/api/comicApi';
	
	const isCollect = ref(false);
	const props = defineProps({
		record:{
			type:Object
		}
	})
	
	
	// 收藏
	const collect = async (item) => {
		const result = await comicApi.insertCourseCollect({
			courseId: props.record.courseId,
			courseDetailsId:props.record.courseId,
			classify: 1,
			type: 1
		});
		if (result.code === 0) {
			uni.showToast({
				title: "收藏成功"
			});
			isCollect.value = true;
		}
	}


	onMounted(() => {
		 isCollect.value = props.record.isCollect;
	})
	
</script>

<style>
</style>